<template>
  <el-dialog :title="'修改'" :close-on-click-modal="false" :visible.sync="visible">
    <el-form
      :model="dataForm"
      :rules="dataRule"
      ref="dataForm"
      @keyup.enter.native="dataFormSubmit()"
      label-width="100px"
    >
      <el-form-item label="姓名" prop="storekeeperName">
        <el-input v-model="dataForm.storekeeperName" placeholder="姓名"></el-input>
      </el-form-item>
      <el-form-item label="电话" prop="phoneNumber">
        <el-input v-model="dataForm.phoneNumber" placeholder="电话"></el-input>
      </el-form-item>
      <el-form-item label="身份证号码" prop="identityNumber">
        <el-input v-model="dataForm.identityNumber" placeholder="身份证号码"></el-input>
      </el-form-item>
      <el-form-item label="邮箱" prop="email">
        <el-input v-model="dataForm.email" placeholder="邮箱"></el-input>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      visible: false,
      dataForm: {
        storekeeperId: 0,
        storekeeperName: "",
        phoneNumber: "",
        // password: "",
        identityNumber: "",
        email: "",
      },
      dataRule: {
        storekeeperName: [
          { required: true, message: "姓名不能为空", trigger: "blur" },
        ],
        phoneNumber: [
          { required: true, message: "电话不能为空", trigger: "blur" },
        ],
        identityNumber: [
          { required: true, message: "身份证号码不能为空", trigger: "blur" },
        ],
        email: [{ required: true, message: "邮箱不能为空", trigger: "blur" }],
      },
    };
  },
  methods: {
    init(id) {
      // console.log("storeKeeperUpdate:",id);
      this.dataForm.storekeeperId = id || 0;
      this.visible = true;
      this.$nextTick(() => {
        this.$refs["dataForm"].resetFields();
        if (this.dataForm.storekeeperId) {
          this.$http.get(
              `${process.env.URL_HEAD}/store/storekeeper/info/${id ? id : 0}`,
              { withCredentials: true }
            )
            .then(({ data }) => {
              if (data && data.code === 0) {
                this.dataForm.storekeeperName =
                  data.storekeeper.storekeeperName;
                this.dataForm.phoneNumber = data.storekeeper.phoneNumber;
                // this.dataForm.password = data.storekeeper.password;
                this.dataForm.identityNumber = data.storekeeper.identityNumber;
                this.dataForm.email = data.storekeeper.email;
              }
            });
        }
      });
    },
    // 表单提交
    dataFormSubmit() {
      this.$refs["dataForm"].validate((valid) => {
        if (valid) {
          this.$http
            .post(
              `${process.env.URL_HEAD}/store/storekeeper/${
                !this.dataForm.storekeeperId ? "save" : "update"
              }`,
              {
                storekeeperId: this.dataForm.storekeeperId || undefined,
                storekeeperName: this.dataForm.storekeeperName,
                phoneNumber: this.dataForm.phoneNumber,
                // password: this.dataForm.password,
                identityNumber: this.dataForm.identityNumber,
                email: this.dataForm.email,
              },
              { withCredentials: true }
            )
            .then(({ data }) => {
              if (data && data.code === 0) {
                this.$message({
                  message: "操作成功",
                  type: "success",
                  duration: 1500,
                  onClose: () => {
                    this.visible = false;
                    this.$emit("refreshDataList");
                  },
                });
              } else {
                this.$message.error(data.msg);
              }
            });
        }
      });
    },
  },
};
</script>
